<template id="special">
    <div>
        <!--固定banner-->
        <div class="special_orange_choose">
              <img v-bind:src="images.url ? images.url : banner"  alt="" @click="golink()">
        </div>

        <div  v-for="(lis,index) in special_list">
            <div>

                 <div class="special_buy" >
                    <div class="special_bi_buy" v-if="lis.is_show==1?1:0" >
                        <h1>
                            <!-- <div class="buy_1"><img class='img' src="../image/x_left.png" alt=""></div>-->
                            <span id="special_buy_3">{{lis.title}}</span>
                            <!--  <div class="buy_2"><img class="img_1" src="../image/x_right.png" alt=""></div>-->
                        </h1>
                        <p class="special_delicious">{{lis.brief}}</p>
                    </div>

                <div class="special_tag_1">
                    <div class="special_orange">
                        <img :src="lis.url" alt="">
                    </div>
                    <!-- <v-common></v-common>-->
                    <div class="special_x_ma">
                        <div class="special_bu_mmg" v-for="sel in lis.list">
                            <div class="special_li_st">
                                <div class="special_x_m">
                                    <img class="img_l1"   v-lazy="sel.thumb" alt="" @click="getChoose(sel.id)">
                                    <span class="wen_zi_m6" v-if="sel.discount">{{sel.discount}}</span>
                                </div>
                                <div class="special_x_right">
                                    <h2 @click="getChoose(sel.id)">{{sel.name}}</h2>
                                    <p @click="getChoose(sel.id)">{{sel.goods_brief}}</p>
                                    <div class="special_Select_price"><span @click="getChoose(sel.id)"><strong>{{sel.shop_price | my-filter}}</strong><time v-if="sel.goods_share">/{{sel.goods_share}}</time></span><img src="../image/gou.png" alt="" @click="addCart(sel.id,sel.thumb)"></div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
         </div>
            </div>
        </div>
        <p style="height:1rem;"></p>
    </div>
</template>
<script>
    export default {
        name:'special',
        components:{
        },
        data(){
            return{
                item_s:[],
                lis:[],
                banner:require('../image/special_ban.png'),
                images:'',
                special_list:[],
            }
        },
        mounted:function(){
             //分享载入
            this.GLOBAL.get_share(this,'special');
            
            //广告位
            this.get_banner();

            //精选数据
            let mode5 = 'special';
            this.GLOBAL.getNew(this,mode5,7);

        },
        methods:{
            getChoose:function(id){
                this.$router.push('/shopDetails?goods_id='+id);
            },
            addCart:function (goods_id,image, number = 1) {
                this.GLOBAL.addCart(this,goods_id,number);
                this.GLOBAL.get_te(image)
            },
            get_banner:function(){
                let url  = this.GLOBAL.BaseUrl+'/mobile/api/v1/Index.php?mode=specialbanner';
                let Data = this.GLOBAL.dataParam();

                this.$ajax.post(url,Data).then((res) => {
                    let temp = res.data;
                    if(temp.code == 200){
                        this.images = temp.data;
                    }else{
                        // this.GLOBAL.center_error(this,temp);
                    }
                })

            },
            golink:function(){
                if(this.images.link){
                    this.$router.push(this.images.link);
                }
            },
        }
    }
</script>
<style>
    /*打折样式*/
    .wen_zi_m6{
        display:block;
        min-height:0.1rem;
        width:auto;
        padding:0 0.05rem;
        color:#ffffff;
        font-size:0.24rem;
        word-break:break-all;
        /*line-height:0.5rem;*/
        -webkit-border-radius: 0.05rem;
        border-radius:0.05rem;
        position:absolute;
        left:0.25rem;
        top:0.1rem;
        background:deeppink;
    }
    .special_x_ma .special_bu_mmg:last-of-type{
        border:0;
    }
    /*最后一个的边框*/
    .special_orange_choose{
        height:2.56rem;
        width:100%;
       /* margin-bottom:0.3rem;*/
    }
    .special_orange_choose img{
        height:2.56rem;
        width:100%;
        display:inline-block;
    }
    /*小马精选的组件内容*/
    .special_x_ma{
        height:auto;
        width:100%;
    }
    .special_bu_mmg{
        height:2.26rem;
        width:100%;
        border-bottom:0.01rem solid #f0f0f0;
    }
    .special_li_st{
        height:2.26rem;
        width:5.95rem;
        margin:0 auto;
        display:flex;
        /*   flex-wrap: wrap;*/
        justify-content:flex-start;
        /*  border-bottom:0.01rem solid #f0f0f0;*/
    }
    .special_Select_price{
        height:0.68rem;
        position:relative;
        top:0;
    }
    .special_Select_price span{
        display:block;
        color:#fc1dac;
        font-size:0.18rem;
        width:2rem;
        height:0.68rem;
        line-height:0.68rem;
    }
    .special_Select_price strong{
        font-size:0.24rem;
    }
    .special_Select_price img{
        display:block;
        position:absolute;
        top: -0.08rem;
        right:0.2rem;
        height:0.6rem;
        width:0.6rem;
    }
    .special_x_m{
        /* flex:1;*/
        height:2.26rem;
        width:2.12rem;
        position:relative;
    }
    .special_x_m img{
        /* display:block;*/
        width:2rem;
        height:2rem;
        margin:0 auto;
    }
    .special_x_right{
        height: 1.76rem;
        width:3.84rem;
        /* flex: 1;*/
        padding-top: 0.5rem
    }
    .special_x_right h2{
        height:0.42rem;
        color:#4a4a4a;
        font-size:0.28rem;
        line-height:0.25rem;
        font-weight:normal;
    }
    .special_x_right p{
        height:0.35rem;
        color:#bababa;
        font-size:0.19rem;
        line-height:0.19rem;
    }
    /*小马*/
    .flyer-img{height:50px;width:50px;border-radius: 50%;}

   /* .buy_list{
        min-height:2.30rem;
        width:100%;
        display:flex;
        !* flex-wrap: wrap;*!
        justify-content:flex-start;
        margin-bottom:0.3rem;
    }*/
    .special_buy_list dl{
        height:2.20rem;
        width:2.11rem;
        /* flex:1;*/
    }
    /*buy*/
    .special_buy{
        min-height:2rem;
        width:100%;
       /* border-bottom:10px solid #f5f4f2;*/
    }
    .special_bi_buy{
       /* margin:0.4rem 0;*/
        width:100%;
        height:1rem;
        padding-top:0.4rem;
    }
    #special_buy_3{
        display:block;
        font-size: 0.32rem;
        color: #4a4a4a;
        line-height: 0.42rem;
        width:100%;
        text-align:center;
        font-weight:normal;
        height:0.42rem;
    }

   /* .special_bi_buy h1{
        display:flex;
        color: #4a4a4a;
        height: 0.42rem;
    }*/
    /*1111*/
    .special_delicious{
        height:0.38rem;
        line-height:0.38rem;
        text-align:center;
        color:#afafaf;
        font-size:0.22rem;
    }
    .special_orange{
        height:2rem;
        width:5.95rem;
        margin-bottom: 0.3rem;
        margin:0 auto;
        border-radius: 0.1rem;
    }
    .special_orange img{
        height:2rem;
        width:5.95rem;
        display:block;
        border-radius: 0.1rem;
    }
</style>
